<!DOCTYPE>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>字典编辑</title>
    <link rel="stylesheet" href="${rc.contextPath}/static/lib/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="${rc.contextPath}/static/plugin/layer/skin/layer.css">
    <link rel="stylesheet" href="${rc.contextPath}/static/css/dj-css.css">
    <style type="text/css">
        body{padding-top:10px;}
        .fl{float:left;}
        .fr{float:right;}
        .por{position: relative;}
        #pagination{margin:0 20px;}
        .layui-form{margin:0 20px;}
        .update input{position: absolute;height:36px;width:100px;z-index:3;opacity: .01;cursor: pointer;}
        .update span{color:#5FB878;position: absolute;left:0;top:0;width: 110px;height:36px;text-align:center;line-height:36px;border:1px solid #ddd;border-bottom-right-radius: 2px;border-top-right-radius:2px;font-size:20px;}
        .update i{color:#000;font-style: normal;font-size:16px;}
        .x-red{color:red;}
        .layui-form-item{line-height: 38px;}
    </style>
</head>
<body>
<div id="createApp">
    <div >
        <fieldset class="layui-elem-field layui-field-title" >
            <legend>内容</legend>
        </fieldset>
        <form class="layui-form layui-form-pane" action="">
            <input type="hidden" name="id" v-model="parameter.id"   autocomplete="off" class="layui-input">
            <div class="layui-form-item boxStyle">
                <div class="dj-select dj-select-inline">
                    <label  style="height:auto;padding:3px 15px;width:110px;text-align: right;">父标题筛选</label>
                    <div class="dj-select-content" >
                        <div class="dj-select-input" flag = 'true' >
                            <span class="dj-selected readOnly" id="level" type="text" name=""  selectedCode='' style="height:40px;line-height:40px;">请选择标题级别</span>
                            <i></i>
                        </div>
                        <ul class="dj-select-list" >
                            <li code = "">请选择标题级别</li>
                            <li code = '1'>1</li>
                            <li code = '2'>2</li>
                            <li code = '3'>3</li>
                            <li code = '4'>4</li>
                            <li code = '5'>5</li>
                        </ul>
                    </div>
                </div>
                <div class="layui-input-inline " style="float: none;">
                    <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入父级标题名称" class="layui-input" v-model="ptitleName">
                </div>
                <span class="layui-btn"   @click="checkPtitle">查询</span>
            </div>

            <div class="layui-form-item">
                <div class="dj-select dj-select-inline boxStyle">
                    <label   style="height:auto;padding:3px 15px;width:110px;">父级标题</label>
                    <div class="dj-select-content" >
                        <div class="dj-select-input" flag = 'true' >
                            <span class="dj-selected readOnly" type="text" name=""  selectedCode='' style="height:40px;line-height:40px;" id="pId">请选择父级标题</span>
                            <i></i>
                        </div>
                        <ul class="dj-select-list" >
                            <li v-for="ptitle in ptitleLevelList" :code="ptitle.id" :class="{'selected':ptitle.code == qsType}">{{ptitle.titleName}}</li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">内容值 </label>
                <div class="layui-input-inline" >
                    <input type="text" name="value"  v-model="parameter.value" placeholder="请输入内容值" autocomplete="off" class="layui-input" @blur="verify(parameter.value)" lay-verify="required">
                </div>
                <span class="x-red">*必填</span>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">内容分数 </label>
                <div class="layui-input-inline" >
                    <input type="text" name="mark"  v-model="parameter.mark" placeholder="请输入内容分数" autocomplete="off" class="layui-input" lay-verify="score">
                </div>
                <span class="x-red">*必填</span>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">类型</label>
                <div class="layui-input-inline">
                    <input type="text" name="type" v-model="parameter.type" lay-verify="required" placeholder="请输入内容类型" autocomplete="off" class="layui-input" @blur="verify(parameter.type)">
                </div>
                <span class="x-red">*必填</span>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">内容排序</label>
                <div class="layui-input-inline">
                    <input type="text" name="order" v-model="parameter.order" lay-verify="order" placeholder="请输入内容排序" autocomplete="off" class="layui-input" lay-verify="order">
                </div>
                <span class="x-red">*必填</span>
            </div>

        </form>
        <div class="layui-form-item" style="margin-left:110px;">
            <button class="layui-btn" lay-submit="" lay-filter="demo2" >提交</button>
        </div>
    </div>
</div>
<script src="${rc.contextPath}/static/lib/jquery.min.js"></script>
<script src="${rc.contextPath}/static/lib/layui/layui.js" charset="utf-8"></script>
<script src="${rc.contextPath}/static/lib/vue.min.js"></script>
<script src="${rc.contextPath}/static/lib/dj-js.js"></script>
<script type="text/javascript">
    var myid="${content.id}"
    if(myid==""){
        var kid=""
        //alert("1213")
    }else {
        kid="$!{content.id}"
       // alert(kid)
    }
    $("#pId").attr("selectedCode",'$!{content.titleId}');
    if('$!{content.titleName}'){
        $("#pId").html('$!{content.titleName}');
    }


    var VM = new Vue({
        el:"#createApp",
        data:{
            parameter:{
                value:'$!{content.value}',
                mark:'$!{content.mark}',
                type:'$!{content.type}',
                order:'$!{content.order}',
                titleId:'$!{content.titleId}',
                createTime:'$!{content.createTime}',
                updateTime:'$!{content.updateTime}',
                updateUser:"$!{content.updateUser}",
                createUser:"$!{content.createUser}",
                id:kid


            },
            ptitleLevel:'',
            ptitleLevelList:[],
            ptitleName:'',
            qsType:''
        },
        methods:{
            sub:function () {
                var _this = this;
                this.parameter.titleId=$("#pId").attr("selectedCode");
                console.log(this.parameter.titleId);
                console.log($("#pId").attr("selectedCode"));

                $.ajax({
                    type: "post",
                    url: "../QsContent/saveOrUpdate.do",
                    data: _this.parameter,
                    dataType: "json",
                    success: function(data){
                        //alert("sdsd")
                        //关闭窗口
                      var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                       parent.layer.close(index);
                       parent.window.location.reload();
                        window.location.href = "javascript:location.replace(location.href)";
                    }
                });
            },
            checkPtitle:function(){
                var _this = this;
                this.parameter.level = $("#level").attr("selectedCode");
               /* _this.ptitleLevel = $("#ptitleLevel").val();*/
                $.ajax({
                    type: "post",
                    url: '${rc.contextPath}/QsTitle/getTitleListBySearch.do',
                    data:{"titleName":_this.ptitleName,"level":_this.ptitleLevel},
                    dataType: "json",
                    success: function (res) {
                        if(res.code == 200){
                            _this.ptitleLevelList = res.result.titleList;
                        }
                        console.log(res);
                    }
                })
            },
            verify:function(){},
            verifyNum:function(){}
        }
    });//vue 实例结束
    layui.use(['layer',"form",'laydate'], function(){
        var form = layui.form(),
                layer = layui.layer,
                laydate = layui.laydate;
        form.on('checkbox(allChoose)', function(data){
            var child = $(data.elem).parents('table').find('tbody input.checkbox');
            child.each(function(index, item){
                item.checked = data.elem.checked;
            });
            form.render('checkbox');
        });

        form.verify({
            order:[/^\+?[1-9][0-9]*$/,"请输入非0正整数为内容排序！"],
            score:[/^\+?[1-9][0-9]*$/,"请输入非0正整数为内容分数！"],
        });
        form.on('submit(demo2)', function(data){
            var _this = VM;
            _this.parameter.titleId=$("#pId").attr("selectedCode");
            console.log(_this.parameter.titleId);
            console.log($("#pId").attr("selectedCode"));

            $.ajax({
                type: "post",
                url: "../QsContent/saveOrUpdate.do",
                data: _this.parameter,
                dataType: "json",
                success: function(data){
                    //alert("sdsd")
                    //关闭窗口
                    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                    parent.layer.close(index);
                    parent.window.location.reload();
                    window.location.href = "javascript:location.replace(location.href)";
                }
            });

        });

    });
</script>
</body>
</html>